@import url('https://fonts.googleapis.com/css?family=Quicksand');


body {
  background: #f3f3f3;
}

.pushable {
  background: #f3f3f3 !important;
}

.ui .label {
  vertical-align: middle;
}

.ui.menu {
  margin-bottom: 0;
}

.ui.menu .item {
  padding-left: 10px;
  padding-right: 10px;
}

body.pushable {
  background: #f3f3f3 !important;
}

@media (max-width: 519px) {
  .pusher {
    margin-top: 40px;
  }
}

.ui.label {
  overflow: auto;
  word-break: break-all;
}

td a {
  font-weight: normal;
  overflow: auto;
  word-break: break-all;
}

td {
  font-weight: normal;
  overflow: auto;
  word-break: break-all;
}

.value {
  overflow: hidden;
  word-break: break-all;
}

@media (max-width: 519px) {
  .ui.statistics .statistic>.value,
  .ui.statistic>.value {
    font-size: 2rem !important;
  }
}

td .ui.label {
  word-break: keep-all !important;
  overflow: visible;
}

td .unbreakable {
  word-break: keep-all !important;
  overflow: visible;
}

.breakable {
  overflow: hidden;
  word-wrap: break-word;
  word-break: break-all;
}

.ui.inverted.segment,
.ui.primary.inverted.segment {
  background: #1d2951;
}

.footbanner {
  /* Increased specificity for SO snippet priority */
  position: absolute;
  bottom: 0;
  width: 100%;
}



.sidebar {
  background-color: #160527 !important;
}

.sidebarConnectionStatus {
  position: fixed !important;
  bottom: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
  width: 100%;
}



.fullHeight {
  height: 100% !important;
}





/* Mobile */
@media only screen and (max-width: 767px) {
    .mobile.hidden,
    .tablet.only,
    .computer.only,
    .large.monitor.only,
    .widescreen.monitor.only {
        display: none !important;
    }
}

/* Tablet / iPad Portrait */
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .mobile.only,
    .tablet.hidden,
    .computer.only,
    .large.monitor.only,
    .widescreen.monitor.only {
        display: none !important;
    }
}

/* Computer / Desktop / iPad Landscape */
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .mobile.only,
    .tablet.only,
    .computer.hidden,
    .large.monitor.only,
    .widescreen.monitor.only {
        display: none !important;
    }
}

/* Large Monitor */
@media only screen and (min-width: 1200px) and (max-width: 1919px) {
    .mobile.only,
    .tablet.only,
    .computer.only,
    .large.monitor.hidden,
    .widescreen.monitor.only {
        display: none !important;
    }
}

/* Widescreen Monitor */
@media only screen and (min-width: 1920px) {
    .mobile.only,
    .tablet.only,
    .computer.only,
    .large.monitor.only,
    .widescreen.monitor.hidden  {
        display: none !important;
    }
}





.main-menu-logo {
  margin-top: 10px;
  margin-bottom: 0px;
  padding-bottom: 5px;
  max-width: 70px;
  margin-left: auto !important;
  margin-right: auto !important;
  width: 50px !important; 
  
}

.logoArea {
  background-color: #dc255d !important;
  color: #fff !important;
  font-family: 'Quicksand', sans-serif !important;
  font-weight: bold;
  text-align: center;
  font-size: 24px;
  min-width: 1em !important;
}

.logoArea img {
  margin-left: auto !important;
  margin-right: auto !important;
  display: block !important;
  margin-bottom: 5px !important;
}

.main-menu-btn {
  font-weight: bold;
  color: #fff !important;
  font-family: 'Quicksand', sans-serif !important;
}
.main-menu-btn .icon {
  font-weight: bold;
  color: #fff !important;
  fill: #fff !important;
  width: 40px !important; 
  height: 40px !important; 
}

.icon.svg.red {
  fill: red !important;
}
.icon.svg.yellow {
  fill: yellow !important;
}
.icon.svg.green {
  fill: #7ED321 !important;
}


/* Hover style for menu items */
.main-menu-btn:hover {
  font-weight: bold;
  background-color: #fff !important;
  color: #000 !important;
  font-family: 'Quicksand', sans-serif !important;
}
.ui.inverted.menu .active.item:hover {
  color: #000 !important;
}

.main-menu-btn:hover .icon {
  color: #000 !important;
  fill: #000 !important;
}
/* Exclude Logo Area :hover */
.logoArea:hover {
  background-color: #dc255d !important;
}


/* Wrapper for all content area */
.main-content-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 100%;
    padding-top: 70px;
    padding-left: 120px;
}

.main-content-wrapper .main-content-warning.ui.fixed.secondary.menu {
  padding-left: 110px;
  /*border-bottom: 1px solid rgba(34,36,38,.15);*/
  background: #fff;
  box-shadow: 0 3px 5px 0 rgba(34,36,38,.15);
}

/* Main content area */
.main-content {
  height: 100%;
  min-height: 100%;
  padding: 20px;
  /*
  background-image: url(/img/bg/left-top.png), url(/img/bg/right-top.png) , url(/img/bg/left-bottom.png), url(/img/bg/right-bottom-key.png) !important;
  background-position: left top, right top, left bottom, right bottom !important;
  */

  /*
  background-image: url(/img/bg/left-top.png), url(/img/bg/right-bottom-key.png) !important;
  background-position: left top, right bottom !important;
  */

  background-image: url(/img/bg/right-bottom-key.png) !important;
  background-position: right bottom !important;
  background-repeat: no-repeat !important;
}

/* Sub page wrapper in body */
.subPageContent { 
  padding-top: 60px;
}



/* Main content wrapper for inside a subpage */
.pageSegment {
  background-color: rgba(255, 255, 255, 0.9) !important;
  box-shadow: 0 1px 7px 0 rgba(0, 0, 0, 0.3) !important;
  border-radius: 0px !important;
  border: 0px !important;
  margin-top: 0px !important;
}

/* Header for a Sub Page */
.ui .pageHeader {
  background-color: #160527;
  color: #fff;
  margin: 0px !important;
  font-family: 'Quicksand', sans-serif;
  padding: 10px;
  font-size: 1.5em !important;
}
.ui .pageHeader .icon {
  float: right;
  padding-top: 0px !important;
}
.ui .pageHeader  .content .sub.header {
  color: #fff !important;
  font-family: 'Quicksand', sans-serif !important;
}


/* Footer links */
.footer {
  display: block;
  position: relative;
  left: 50%;
  bottom: 0px;
  transform: translate(-50%, -50%);
  margin: 0 auto;
  margin-top: 70px;
  z-index: 10;
}
.footerLogo {
  width: 50px;
}


/* Page Tab Styles */
.tab {
  border-radius: 0px !important;
}

.ui.tabular.menu .active.item {
  border-radius: 0px !important;
  background-color: #fff !important;
  color: #0A0724 !important;
}

.ui.tabular.menu .item {
  background-color: #160527 !important;
  color: #fff !important;
}



/* Form Styles */
input {
  background-color: #E3E1E3 !important;
  color: #0A0724 !important;
  border-radius: 0px !important;
}

.ui.button.red {
  background-color: #dc255d !important;
  box-shadow: 0 1px 7px 0 rgba(0, 0, 0, 0.3) !important;
  color: #fff !important;
  border-radius: 0px !important;
  font-family: Quicksand !important;
  font-size: 14px;
}
.ui.button.sky {
    background-color: #4A90E2 !important;
    box-shadow: 0 1px 7px 0 rgba(0, 0, 0, 0.3) !important;
    color: #fff !important;
    border-radius: 0px !important;
    font-family: Quicksand !important;
    font-size: 14px;
}
.ui.button.plain  {
  background-color: #f3f3f3 !important;
  box-shadow: 0 1px 7px 0 rgba(0, 0, 0, 0.3) !important;
  border: solid 1px #160527 !important;
  color: #0A0724 !important;
  border-radius: 0px !important;
  font-family: Quicksand !important;
  font-size: 14px;
}

.ui.selection.dropdown {
  background-color: #E3E1E3 !important;
  color: #0A0724 !important;
  box-shadow: 0 !important;
  border: solid 1px #160527 !important;
  border-radius: 0px !important;
}


/* Wallet Created Segments */
.ui.inverted.segment, .ui.primary.inverted.segment {
  background-color: #E3E1E3 !important;
  box-shadow: 0 !important;
  border-radius: 0px !important;
  color: #0A0724 !important;
}



/* Transactions */
.transactionRecord {
  background-color: #fff !important;
  border-radius: 0px !important;
  padding-left: 1em !important;
}
.transactionRecordInternal {
  background-color: #fff !important;
  border-radius: 0px !important;
  padding-left: 0 !important;
  border: 0 !important;
  padding: 0 !important;
  box-shadow: 0px 0px 0px 0px rgba(0,0,0,0) inset, 0px 0px 0px 0px rgba(0, 0, 0, 0) !important;
  margin: 0 !important;
}
.transactionTypeImage {
  padding-right: 1em !important;
}

.transactionAddress {
  font-size: 9px;
}


.wordBreak {
  word-wrap: break-word;
  word-break: break-all;
}

.only-mobile {
  display: none;
}

.mobile-wallet {
  padding-bottom: 85px;
}

.mobile-wallet > h4.ui.header, h3.ui.header {
 font-family: Quicksand;
 font-size: 1.5em;
 text-align: center;
 font-weight: 300;
 margin-top: 0px;
 padding-top: 10px;
 padding-bottom: 10px;
 color: #fff;
 background: #1b1c1d;
 display: block !important;
}

.mobile-wallet > h3.ui.header > i.icon {
  display: none;
}



.mobile-wallet > div.ui.selection.floatright {
  float: none;
}
#mainSearch {
  width:400px !important;
}
.mobile-wallet > div.ui.selection.floatright > div.ui.icon.fluid.input > input#mainSearch {
    width: 90% !important;
    display: flex !important;
    margin-left: 5%;
    margin-right: 5% !important;
}
.mobile-wallet > div.ui.selection.floatright > div.ui.icon.fluid.input > i.search.link.icon {
margin-right: 5% !important;
}
.mobile-wallet > div.ui.icon.message {
  width: 95% !important;
  margin-left: 2.5%;
  margin-right: 2.5%;
  display: flex;
}
.mobile-wallet > div.ui.segment.pageSegment {
  width: 95% !important;
  margin-left: 2.5%;
  margin-right: 2.5%;
  /*display: flex;*/
}
.mobile-wallet > div > .float-right {
  box-sizing: initial;
}
.mobile-wallet > div.footer {
  padding-top: 50px !important;
}
.mobile-wallet > .pageHeader > .icon {
  padding-left: 0.5em;
}
.mobile-wallet > #networkDropdown {
  width: 100%;
  margin-bottom: 2px;
  z-index: 1000;
}
.mobile-wallet > #transferForm > div > div > .transactionRecord > .content > p.transactionAddress {
  word-break: break-all !important;
}
.mobile-wallet > #walletFile {
  max-width: 70% !important;
}
.mobile-wallet > div.extra {
  word-wrap: break-word; 
}
.ui.segment {
  border-radius: 0px
}
.msHeader {
  background: rgba(27, 28, 29, 0.7) !important;
}
